<template>
<div class="mainDiv" style="padding:20px;box-sizing: border-box;flex-direction: column;">
	<div class="rowHead">
				<el-input
					class="searchArea"
					placeholder="搜索品牌名称或描述"
					v-model="page.search"
					@keyup.enter.native="searchList">
					<i slot="suffix" class="el-icon-search" style="line-height: 40px;width: 25px;cursor: pointer;" @click="searchList"></i>
				</el-input>
			</div>

			<el-table :data="list" :stripe="true" @row-click="danji" @row-dblclick="dblclick" height="100%">
				<el-table-column prop="id" label="ID" width="100"></el-table-column>
				<el-table-column prop="name" label="品牌名称"></el-table-column>
				<el-table-column prop="remarks" label="品牌描述" :show-overflow-tooltip="true"></el-table-column>
				<el-table-column prop="isdisabled" label="状态">
					<template slot-scope="scope">
						<el-tag type="success" size="mini" v-if="!scope.row.isdisabled">正常</el-tag>
						<el-tag type="danger" size="mini" v-else>停用</el-tag>
					</template>
				</el-table-column>
				<el-table-column prop="fname" label="所属厂商"></el-table-column>
				<el-table-column prop="addtime" label="添加日期">
					<template slot-scope="scope">
						{{scope.row.addtime|dateTime}}
					</template>
				</el-table-column>
				<el-table-column label="选择">
					<template slot-scope="scope">
						<el-switch
							v-model="scope.row.selected"
							on-text="是"
							off-text="否">
						</el-switch>
					</template>
				</el-table-column>
			</el-table>
			<div class="block center bg-light">
				<el-pagination
					@current-change="currentChange"
					:current-page="page.pages"
					:page-size="page.limits"
					layout="total, prev, pager, next"
					:total="total">
				</el-pagination>
			</div>
			<div style="text-align:right">
				<el-button icon="upload2" type="success" size="mini" @click="submit">确定选择</el-button>
				<el-button icon="close" type="danger" size="mini" @click="close">取消关闭</el-button>
			</div>
</div>	
</template>
<script>
import C from '#/src/common/common.js'

export default {
    name: 'openBrandList',
    data () {
        return {
            list: [],
            total: 0,
            page: {
                pages: 1,
                limits: 15,
                search: '',
                zt: 0,
            }
        }
    },
    methods: {
        danji: function(row, event){
            event.preventDefault()
            this.list.forEach((col)=>{
                col.selected = false
            })
            row.selected = true
            this.select = row
        },
        dblclick: function(row, event){
            event.preventDefault()
            C.closeBrowserWindow(row)
        },
        submit: function(){
            if (!this.select.id) {
                C.error('请选择分类')
                return false
            }
            C.closeBrowserWindow(this.select)
        },
        close: function(){
            C.closewin()
        },
        currentChange: function(val){
            this.page.pages = val
            this.getList()
        },
        searchList: function(){
            this.getList()
        },
        getList: async function(nums,limits,searchStr){
            let that = this
            let data = await C.ajax('/shop/brand/getAllBrandList', this.page)
            if (data) {
                that.total = data.count
                data.data.forEach((row)=>{
                    row.selected = false
                })
                that.list = data.data
            }
        }
    },
    mounted: function(){
        this.getList()
    }
}
</script>